<template>
	<view class="main">
		<u-navbar
		    :title="showInfo.title"
		    :autoBack="true"
			bgColor="#292929"
			leftIconColor="#FFFFFF"
			:titleStyle ="{color:'#FFFFFF',fontSize:'40rpx'}"
		 />
		<image class="status-image" :src="showInfo.img" mode="widthFix"/>
		<text class="status-text">{{showInfo.msg}}</text>
		<button class="changeBth color" @click="returnBth">{{$t('status.return')}}</button>
		<button class="changeBth" v-if="showInfo.bthtext" @click="toAgain">{{showInfo.bthtext}}</button>
	</view>
</template>

<script>
	export default {
		data(){
			return{
				showInfo:{}
			}
		},
		computed:{
		   	statusInfo(){
				return {
					'passwordsuccess':{ //修改成功
						title:this.$t('password.navtitle'),
						msg:this.$t('status.success1'),
						img:"/static/success.png",
						bthtext:"",
					},
					'passwordfail':{//修改失败
						title:this.$t('password.navtitle'),
						msg:this.$t('status.err1'),
						img:"/static/warning.png",
						bthtext:this.$t('status.bth1'),
					},
					'Modifiedsuccess':{//认证成功
						title:this.$t('authentication.title'),
						msg:this.$t('status.success'),
						img:"/static/success.png",
						bthtext:"",
					},
					'Modifiedfail':{//认证失败
						title:this.$t('authentication.title'),
						msg:this.$t('status.err'),
						img:"/static/warning.png",
						bthtext:this.$t('status.bth'),
					},
				}
			}
		},
		onLoad(opt) {
			// console.log(opt)
			this.showInfo = this.statusInfo[opt.status]
			if(opt.msg){
				this.showInfo.msg = opt.msg
			}
		},
		methods:{
			returnBth(){
				uni.navigateBack({
					delta:2,
					fail:(err)=>{
						uni.reLaunch({
							url:'/pages/login/login'
						})
					}
				})
			},
			toAgain(){
				uni.navigateBack({
					delta:1,
					fail:(err)=>{
						uni.reLaunch({
							url:'/pages/login/login'
						})
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
 .main{
	 width: 100vw;
	 min-height: 100vh;
	 background-color: #080808;
	 display: flex;
	 flex-direction: column;
	 align-items: center;
	 justify-content: center;
	 font-family: my-font;
	 .status-image{
		 width: 220rpx;
         margin-bottom: 20rpx;
	 }
	 .status-text{
		 color: #fff;
		 margin-bottom: 180rpx;
	 }
	 .changeBth{
		 width: 490rpx;
		 height: 140rpx;
		 line-height: 140rpx;
		 border-radius: 30rpx;
		 margin-top: 30rpx;
	 }
	 .color{
		 color: #fff;
		 background-color: #2D3139;
	 }
 }
</style>
